﻿@model List<Mundialeitor2.Models.PartidoModel>
@{
    ViewBag.Title = "Boleta";
}
<h2>Boleta</h2>
<div>
    @{
        var grupoA = Model.Take(6).ToList();
        var grupoB = Model.Skip(6).Take(6).ToList();
        var grupoC = Model.Skip(12).Take(6).ToList();
        var grupoD = Model.Skip(18).Take(6).ToList();
        var grupoE = Model.Skip(24).Take(6).ToList();
        var grupoF = Model.Skip(30).Take(6).ToList();
        var grupoG = Model.Skip(36).Take(6).ToList();
        var grupoH = Model.Skip(42).Take(6).ToList();
    }
    <h3>Primera ronda</h3>
    <!-- Nav tabs -->
    <ul class="nav nav-tabs" id="myTab">
        <li class="active"><a href="#grupoA" data-toggle="tab">A</a></li>
        <li><a href="#grupoB" data-toggle="tab">B</a></li>
        <li><a href="#grupoC" data-toggle="tab">C</a></li>
        <li><a href="#grupoD" data-toggle="tab">D</a></li>
        <li><a href="#grupoE" data-toggle="tab">E</a></li>
        <li><a href="#grupoF" data-toggle="tab">F</a></li>
        <li><a href="#grupoG" data-toggle="tab">G</a></li>
        <li><a href="#grupoH" data-toggle="tab">H</a></li>
    </ul>
    <!-- Tab panes -->
    <div class="tab-content">
        <div class="tab-pane active" id="grupoA">@Html.Partial("_GrupoView", grupoA)</div>
        <div class="tab-pane" id="grupoB">@Html.Partial("_GrupoView", grupoB)</div>
        <div class="tab-pane" id="grupoC">@Html.Partial("_GrupoView", grupoC)</div>
        <div class="tab-pane" id="grupoD">@Html.Partial("_GrupoView", grupoD)</div>
        <div class="tab-pane" id="grupoE">@Html.Partial("_GrupoView", grupoE)</div>
        <div class="tab-pane" id="grupoF">@Html.Partial("_GrupoView", grupoF)</div>
        <div class="tab-pane" id="grupoG">@Html.Partial("_GrupoView", grupoG)</div>
        <div class="tab-pane" id="grupoH">@Html.Partial("_GrupoView", grupoH)</div>
    </div>
</div>

<script type="text/javascript">
    $(function () {
        $('#myTab a:last').tab('show');
    })
</script>